{% extends "reports/base.html" %}

{% block title %}Mgl Dev Cycles Report{% endblock %}

{% block jQuery_init %}
    $(".cycle-accordion").accordion({
        active: -1, collapsible: true, header: "h3", autoHeight: false, fillSpace: false,
    });
    
    $(".cycle-tabs").tabs({
        collapsible: false, active:1, 
        //event: "mouseover",
        ajaxOptions: {
            error: function( xhr, status, index, anchor ) {
                $( anchor.hash ).html( "Couldn't load this tab. Please contact the R&D." );
            }
        }
    });
{% endblock jQuery_init %}

{% block content %}
    <div class="cycle-accordion">
        {% for cycle in cycles %}
            <h3><a href="#">{{ cycle }}</a></h3>
            <div id=cycle_{{cycle.pk}}>
                {% include "reports/cycle_toolbar.html" %}
                <div id=cycle_tabs_{{cycle.pk}} class="cycle-tabs" style="padding:10px;">
                    <ul>
                        <li><a href="#tabs-comments-id{{cycle.pk}}">Comments</a></li>
                        <li><a href="Cycles/{{cycle.pk}}/Components/Tasks?can_edit={{can_edit}}">Tasks</a></li>
                        <li><a href="Cycles/{{cycle.pk}}/Components/Summary">Summary</a></li>
                    </ul>
                    <div id="tabs-comments-id{{cycle.pk}}">
                        {% if can_edit == "True" %}
                        <a class="ui-icon ui-icon-pencil" href="/admin/TasK/cycle/{{cycle.pk}}/" target="admin_win">Edit</a>
                        {% endif %}
                        {% autoescape off %}
                            {{ cycle.comments }}<br>
                        {% endautoescape %}
                    </div>
                </div>
            </div>
        {% endfor %}
    </div>
{% endblock content %}

